import 'dart:ui';

import 'package:flutterclue/main.dart';

import 'AndroidPopWindow.dart';
import 'package:flutter/material.dart';
import 'package:scoped_model/scoped_model.dart';

///首页筛选栏按钮
class ClueManagerButton extends StatefulWidget {
  final int selectType;
  final ValueChanged<ClueSelectMode> onSelect;
  final String buttonName;

  const ClueManagerButton({this.onSelect, this.selectType, this.buttonName});

  @override
  State<StatefulWidget> createState() => new _ClueManagerButtonState();
}

class _ClueManagerButtonState extends State<ClueManagerButton> {
  ClueSelectMode _selectClueSelectMode;

  _onSelect(ClueSelectMode selectClueSelectMode) {
    setState(() {
      _selectClueSelectMode = selectClueSelectMode;
    });
    if (widget.onSelect != null) widget.onSelect(_selectClueSelectMode);
  }

  @override
  Widget build(BuildContext context) {
//定义一个按钮，添加PopupTypeWindow为关联弹窗界面。
    return new PopupButton<ClueSelectMode>(
        name: widget.buttonName,
        onSelected: (value) => _onSelect(value),
        child: new ClueManagerWindow(
          selectType: widget.selectType,
        ),
        fullWidth: true,
        offset: new Offset(0.0, 0.0));
  }
}

///首页筛选弹窗
class ClueManagerWindow extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new _ClueManagerWindowState();

  ClueManagerWindow({this.selectType});

  final selectType;
}

class _ClueManagerWindowState extends State<ClueManagerWindow>
    with SingleTickerProviderStateMixin {
  final List<ClueSelectMode> _originData = [
    ClueSelectMode(true, "全部", 0),
    ClueSelectMode(false, "今日", 1),
    ClueSelectMode(false, "昨日", 2),
    ClueSelectMode(false, "本周", 3),
    ClueSelectMode(false, "上周", 5),
    ClueSelectMode(false, "本月", 4),
    ClueSelectMode(false, "上月", 6),
    ClueSelectMode(false, "本年", 7)
  ];
  AnimationController _controller;
  Animation<double> _height;
  Animation<double> _opacity;

  _confirm(int i) {
    for (int j = 0; j < _originData.length; j++) {
      if (i == j) {
        _originData[j].isSelect = true;
      } else {
        _originData[j].isSelect = false;
      }
    }
    setState(() {});
    Navigator.of(context).pop(_originData[i]);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  void initState() {
    super.initState();
    for (int j = 0; j < _originData.length; j++) {
      if (_originData[j].selectType == widget.selectType) {
        _originData[j].isSelect = true;
      } else {
        _originData[j].isSelect = false;
      }
    }
    _controller =
        AnimationController(vsync: this, duration: Duration(milliseconds: 300));
    _height = Tween<double>(begin: 0, end: 200)
        .animate(CurvedAnimation(parent: _controller, curve: Curves.decelerate))
          ..addListener(() {
            setState(() {});
          });
    _opacity = Tween<double>(begin: 0.0, end: 1.0)
        .animate(CurvedAnimation(parent: _controller, curve: Curves.decelerate))
          ..addListener(() {
            setState(() {});
          });
    _controller.forward();
  }

  @override
  Widget build(BuildContext context) {
    return ScopedModelDescendant<CounterModel>(
      builder: (context, wighet, mode) {
        return Opacity(
          opacity: _opacity.value,
          child: new Container(
            child: Column(
              children: <Widget>[
                new Container(
                    height: _height.value,
                    child: Container(
                      child: new GridView.builder(
                          itemCount: _originData.length,
                          gridDelegate:
                              new SliverGridDelegateWithFixedCrossAxisCount(
                            childAspectRatio: 5 / 2.5,
                            crossAxisCount: 4,
                          ),
                          itemBuilder: (context, i) {
                            return new Container(
                              color: Colors.white,
                              child: Center(
                                child: GestureDetector(
                                  onTap: () {
                                    _confirm(i);
                                  },
                                  child: Container(
                                      margin: EdgeInsets.only(left: 12,right: 12,top: 12,bottom: 12),
                                      decoration: new BoxDecoration(
                                        color: _originData[i].isSelect
                                            ? Color(0xff0188fb)
                                            : Color(0xfff4f4f4),
                                        borderRadius: new BorderRadius.all(
                                            new Radius.circular(3)),
                                      ),
                                      child: SizedBox(
                                        width: 110,
                                        height: 45,
                                        child: Center(
                                            child: new Text(
                                                _originData[i].showString,
                                                style: new TextStyle(
                                                    fontSize: 14,
                                                    color: _originData[i]
                                                            .isSelect
                                                        ? Colors.white
                                                        : Color(0xff333333)))),
                                      )),
                                ),
                              ),
                            );
                          }),
                    )),
                new Expanded(
                  child: GestureDetector(
                    onTap: () {
                      Navigator.of(context).pop();
                    },
                  ),
                ),
              ],
            ),
            color: Color(0x55333333),
            height: (MediaQuery.of(context).size.height -
                MediaQueryData.fromWindow(window).padding.top -
                52),
          ),
        );
      },
    );
  }
}

class ClueSelectMode {
  bool isSelect;
  String showString;
  int selectType;

  ClueSelectMode(this.isSelect, this.showString, this.selectType);
}
